<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.Date" %>
<%@ page import="java.util.Calendar" %>
<%@ page import="java.util.GregorianCalendar" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ page import="java.io.*,java.util.*" %>
<html lang="zh-CN">
<head>
    <!-- 引入各种CSS样式表 -->
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/index.css">
    <%--    图标--%>
    <link rel="stylesheet" href="icon/iconfont.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/c/font_4336496_3iu2a7l8bg8.css">
    <!--引入jquery和bootstrap -->
    <script type="text/javascript" src="js/jquery-1.12.3.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>

    <title>在线考试系统学生菜单</title>
</head>

<body>
<%--顶部菜单栏--%>
<nav class="navbar navbar-inverse navbar-fixed-top" style="background-image: linear-gradient( #66afe9, #2e6da4);border-bottom:solid #2e6da4">
    <div class="container">
        <%--        标题--%>
        <div class="navbar-header" >
            <a class="navbar-brand" href="student_index.jsp"
               style="font-size: 30px;color: white;padding-left: 500px;width: 800px;">在线考试系统</a>
        </div>
        <%--退出--%>
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
                <li><a href="logout" style="color: white;background-image: linear-gradient( #66afe9, #2e6da4); "> 退出</a></li>
            </ul>
            <%--登录用户名--%>
            <ul class="nav navbar-nav navbar-right">
                <li style="color: white;line-height: 48px;"><i class="iconfont icon-yonghu"></i>${STUDENT_NAME}</li>
            </ul>
        </div>
    </div>
</nav>

<%--左侧菜单栏--%>
<div class="container-fluid">
    <div class="row-fluie">
        <div class="col-sm-3 col-md-2 sidebar">
            <ul class="nav nav-sidebar">
                <%--一级菜单--%>
                <li ><a href="studentInfo"  class="nav-header menu-first collapsed"><i class="iconfont icon-gerenxinxi"></i> 个人信息</a>
                </li>

                <%--二级菜单 --%>
                <li ><a href="#exam" class="nav-header menu-first collapsed" data-toggle="collapse">
                    <i class="iconfont icon-kaoshi" style="height: 100px;"></i> 我的考试</a>
                </li>
                <ul id="exam" class="nav nav-list collapse menu-second ">
                    <li ><a href="loadStudentExamList" ><i class="fa fa-list-alt"></i>参加考试</a></li>
                    <li ><a  href="loadMyScoreList"  ><i class="fa fa-list-alt"></i>我的成绩</a></li>
                </ul>
                <%--一级菜单--%>
                <li><a href="loadMistakesList" class="nav-header menu-first collapsed" >
                    <i class="iconfont icon-cuotiben"></i> 我的错题 </a>
                </li>
            </ul>
        </div>
    </div>
</div>

<script type="text/javascript">

    // 选中左边菜单栏的颜色变化
    $(document).ready(function () {
        $('ul.nav > li').click(function (e) {
            $('ul.nav > li').removeClass('active');
            $(this).addClass('active');
        });
    });

</script>
</body>
</html>